<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>精灵图</title>
    <style>
        #container{
            display: flex;
            flex-wrap: wrap;
            
        }
        #box {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 50% 100%;
            border: 5px #a5a5a5 solid;
        }
        
        #box2 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 60% 25%;
            border: 5px #a5a5a5 solid;
        }
        
        #box3 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 0% 0%;
            border: 5px #a5a5a5 solid;
        }
        
        #box4 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 75% 50%;
            border: 5px #a5a5a5 solid;
        }
        
        #box5 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 80% 25%;
            border: 5px #a5a5a5 solid;
        }
        
        #box6 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 60% 25%;
            border: 5px #a5a5a5 solid;
        }
        
        #box7 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 50% 50%;
            border: 5px #a5a5a5 solid;
        }
        
        #box8 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 0% 75%;
            border: 5px #a5a5a5 solid;
        }
        
        #box9 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 60% 25%;
            border: 5px #a5a5a5 solid;
        }
        
        #box10 {
            height: 160px;
            width: 160px;
            background-image: url(image/精灵图.png);
            background-position: 100% 75%;
            border: 5px #a5a5a5 solid;
        }
        </style>
</head>

<body>
    <div align="left" id="container">
        <div id="box"></div>
        <div id="box2"></div>
        <div id="box3"></div>
        <div id="box4"></div>
        <div id="box5"></div>
        <div id="box6"></div>
        <div id="box7"></div>
        <div id="box8"></div>
        <div id="box9"></div>
        <div id="box10"></div>
    </div>
</body>

</html>